<div>
    <ul class="nav nav-tabs" role="tablist">
        <li role="presentation" class="active">
            <a href="#user" aria-controls="user" role="tab" data-toggle="tab">
                用户 <span class="badge badge-success bounceIn animation-delay1 active">{{ users|length }}</span>
            </a>
        </li>
        <li role="presentation">
            <a href="#group" aria-controls="group" role="tab" data-toggle="tab">
                组 <span class="badge badge-info bounceIn animation-delay2 active">{{ groups|length }}</span>
            </a>
        </li>
    </ul>

    <div class="tab-content">
        <div role="tabpanel" class="tab-pane active" id="user">
            <table class="table table-hover">
                <tr class="info">
                    <th>姓名</th>
                    <th>账号</th>
                    <th>手机号</th>
                </tr>
                {% for row in users %}
                    <tr>
                        <td>{{ row['sUserName'] }}</td>
                        <td>{{ row['sLogonName'] }}</td>
                        <td>{{ row['sSelfPhone'] }}</td>
                    </tr>
                {% endfor %}
            </table>
        </div>
        <div role="tabpanel" class="tab-pane" id="group">
            <table class="table table-hover">
                <tr class="info">
                    <th>组名</th>
                    <th>类型</th>
                </tr>
                {% for row in groups %}
                    <tr>
                        <td>{{ row['sName'] }}</td>
                        <td>{{ row['iType'] }}</td>
                    </tr>
                {% endfor %}
            </table>
        </div>
    </div>
</div>